<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        (function(){var a = 10,
            b = 20;
        function fn(x) {
            var a = 100,
                c = 300;
            console.log('fn: ', a, b, c, x);
            function bar(x) {
                var a = 1000,
                    d = 400;
                console.log('bar: ', a, b, c, d, x);
            }
            bar(100);
            bar(200);
        }
        fn(10);})();
        // fn: 100 20 300 10
        // bar: 1000 20 300 400 100
        // bar: 1000 20 300 400 200 

        (function(){var aa = 2;
        function fn1(){
            var bb = 3;
            function fn2(){
                var cc = 4;
                console.log(cc); //4
                console.log(bb); //3
                console.log(aa); //2
                // console.log(dd); // is not defined
            }
            fn2();
        }
        fn1();})();

        /* 测试题 */
        //1
        var x = 10;
        function fn(){
            console.log(x); //定义时x作用域在全局
        }
        function show(f) {
            var x = 20;
            f();
        }
        show(fn); //10

        //2
        var fn1 = function(){
            console.log(fn1);
        }
        fn1(); //function f1
        var obj = {
            fn2: function(){
                console.log(this.fn2);
                console.log(fn2); // is not defined
                /* 函数中没有fn2变量 全局中也没有fn2变量 */
                /* fn2是obj的属性 应该用this.fn2引用 */
            }
        }
        obj.fn2();
    </script>
</body>

</html>